<template>
  <view class="wrap-fff">
    <view v-for="(item,index) in cartInfo" :key="index" class="order_goods">
      <view class="flex">
        <image v-if="item.productInfo.attrInfo" :src='item.productInfo.attrInfo.image' class="w-136 h-136 rd-16rpx"></image>
        <image v-else :src='item.productInfo.image' class="w-136 h-136 rd-16rpx"></image>
        <view class="flex-1 flex justify-between pl-20">
          <view class="w-360rpx">
            <view class="w-full line2 fs-28 lh-40rpx">
              {{item.productInfo.store_name}}
            </view>
            <view class="w-full line1 fs-24 text--w111-999 lh-34rpx mt-8">{{item.productInfo.attrInfo.suk_alias}}</view>
          </view>
          <view class="flex-1 flex-col items-end">
          </view>
        </view>
      </view>
    </view>

    <view class="price-box">
      <view class="cell flex-between-center">
        <text class="l">续租时长</text>
        <view>
          <picker class='num' @change="bindPickerChange" :value="dayIndex" :range="dayList" range-key="value">
            <view class="picker acea-row row-between-wrapper">
              <view class='reason'>{{dayList[dayIndex].value}}天</view>
              <text class='iconfont icon-ic_rightarrow'></text>
            </view>
          </picker>
        </view>
      </view>
      <view class="cell flex-between-center">
        <text class="l">续租租金</text>
        <text class="fs-30 Regular">{{getAmount}}</text>
      </view>
    </view>

    <view class="bottom-box">
      <view class="btn-square w-full" @click="goXuzu()">确认提交</view>
    </view>


  </view>
</template>

<script>
import {getOrderDetail} from "@/api/order";
import {reletLease} from "@/api/leaseOrder";
import auto from '@/mixins/auto';

export default {
  mixins: [auto],
  data() {
    return {
      faceTimes:0,
      cartInfo:{},
      orderInfo:{},
      dayIndex: 0,
      dayList:[
        {
          value:3
        },
        {
          value:7
        },
        {
          value:10
        },
        {
          value:15
        },
        {
          value:25
        },
        {
          value:30
        },
        {
          value:90
        },
        {
          value:120
        },
        {
          value:180
        },
        {
          value:270
        },
        {
          value:365
        },
      ]
    }
  },
  onLoad(options) {
    this.order_id = options.order_id;
    this.getOrderInfo()
  },
  computed: {
    getAmount() {
	  let days = this.dayList[this.dayIndex].value
	  let amount = 0
	  if (this.orderInfo.order_lease && this.orderInfo.order_lease.day_price) {
          amount = this.orderInfo.order_lease.day_price * days
	  }
      return amount
    },
  },
  methods: {
    getOrderInfo(){
      getOrderDetail(this.order_id).then(res=>{
        this.cartInfo = res.data.cartInfo;
        this.orderInfo=res.data
      })
    },
    bindPickerChange(e) {
      this.$set(this, 'dayIndex', e.detail.value);
    },
    goXuzu(){
      reletLease(this.orderInfo.id,{days:this.dayList[this.dayIndex].value}).then(res=>{
        // 长租-生成新订单
        if(res.data.order_id){
          uni.redirectTo({
            url: `/pages/goods/lease_order_details/index?order_id=${res.data.order_id}`
          })
          return
        }

        my.startAPVerify({
          url: res.data.apply.originalUrl,
          certifyId: res.data.apply.faceToken,
          complete: (res) => {
            console.log(res);
            if(res.resultStatus === "9000") {
              this.getVerifyCheckUser(this.orderInfo.unique)
              uni.redirectTo({
                url: '/pages/goods/lease_order_list/index'
              })
            } else {
              this.$util.Tips({  title: '验证失败：' + res.resultStatus })
            }
          }
        })
      })
    },
  },
}
</script>

<style lang="scss" scoped>
.order_goods{
  padding: 20rpx;
}
.price-box{
  margin-top: 30rpx;
  .cell{
    padding: 20rpx;
    .l{
      color: #666;
    }
  }
  .cell-end{
    border-top: 1rpx solid #f5f5f5;
    .l{
      color: #000;
    }
  }
}
.bottom-box{
  width: 100%;
  position: fixed;
  left: 0;
  bottom: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 30rpx 20rpx;
  border-top: 1rpx solid #f5f5f5;
  .btn-square{
    // todo
    background: #00aaea !important;
    height: 80rpx;
  }
}
</style>